{{ define "content" }}
<script type="application/javascript">
    function valueFormat(n) {
        return new Intl.NumberFormat().format(n);
    }
</script>
<div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_content">
                <div role="tabpanel">
                    <ul class="nav nav-tabs bar_tabs" role="tablist">
                        <li role="presentation"{{ if eq .action "" }} class="active"{{ end }}><a href="{{ if eq .action "" }}javascript:void(0);{{ else }}{{ .Request.URL.Path }}{{ end }}">{{ i18n "Current measurements" . }}</a></li>
                        <li role="presentation"{{ if eq .action "archive" }} class="active"{{ end }}><a href="{{ if eq .action "archive" }}javascript:void(0);{{ else }}{{ .Request.URL.Path }}?action=archive{{ end }}">{{ i18n "Archive" . }}</a></li>
                    </ul>
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane fade active in">
                            {{ if eq .action "archive" }}
                            <div class="well" style="overflow: auto">
                                <form class="form-horizontal" role="form" method="get" action="{{ .Request.URL.Path }}" id="archive-form" novalidate>
                                    <input type="hidden" value="archive" name="action" />
                                    <input type="hidden" value="" name="from" />
                                    <input type="hidden" value="" name="to" />
                                    <div class="col-md-4">
                                        {{ i18n "Date range" . }}
                                        <fieldset>
                                            <div class="control-group">
                                                <div class="controls">
                                                    <div class="input-prepend input-group">
                                                        <span class="add-on input-group-addon"><i class="fa fa-calendar"></i></span>
                                                        <input type="text" id="archive-date" class="form-control" value="{{ .date_from.Format "2006.01.02 15:04" }} - {{ .date_to.Format "2006.01.02 15:04" }}" />
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                    </div>
                                    <div class="col-md-4">
                                        {{ i18n "Period" . }}
                                        <fieldset>
                                            <div class="control-group">
                                                <div class="controls">
                                                    <div class="input-prepend input-group" style="width: 100%">
                                                        <select id="period" name="period" class="form-control select2" required="required">
                                                            <option value="monthly"{{ if eq .period "monthly" }} selected="selected"{{ end }}>{{ i18n "Monthly" . }}</option>
                                                            <option value="daily"{{ if eq .period "daily" }} selected="selected"{{ end }}>{{ i18n "Daily" . }}</option>
                                                            <option value="hourly"{{ if eq .period "hourly" }} selected="selected"{{ end }}>{{ i18n "Hourly" . }}</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                    </div>
                                    <div class="col-md-2">
                                        &nbsp;
                                        <fieldset>
                                            <div class="control-group">
                                                <div class="controls">
                                                    <div class="input-prepend input-group">
                                                        <button type="submit" class="btn btn-success">{{ i18n "Show" . }}</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                    </div>
                                </form>
                            </div>
                            <table class="table table-striped datatable dt-responsive nowrap" style="width:100%">
                                <thead>
                                <tr>
                                    <th>{{ i18n "Date" . }}</th>
                                    <th>{{ i18n "Energy" . }}<br />{{ i18n "Gcal" . }}</th>
                                    {{ if gt .Bind.Config.InputsCount 0 }}<th>{{ i18n "Pulse input %d" . nil nil nil 1 }}<br />{{ raw (i18n "m<sup>3</sup> / pulses" .) }}</th>{{ end }}
                                    {{ if gt .Bind.Config.InputsCount 1 }}<th>{{ i18n "Pulse input %d" . nil nil nil 2 }}<br />{{ raw (i18n "m<sup>3</sup> / pulses" .) }}</th>{{ end }}
                                    {{ if gt .Bind.Config.InputsCount 2 }}<th>{{ i18n "Pulse input %d" . nil nil nil 3 }}<br />{{ raw (i18n "m<sup>3</sup> / pulses" .) }}</th>{{ end }}
                                    {{ if gt .Bind.Config.InputsCount 3 }}<th>{{ i18n "Pulse input %d" . nil nil nil 4 }}<br />{{ raw (i18n "m<sup>3</sup> / pulses" .) }}</th>{{ end }}
                                </tr>
                                </thead>
                                <tbody>
                                {{ range $i, $stat := .stats }}
                                <tr>
                                    <td>
                                        {{ if eq $.period "monthly" }}
                                            {{ i18n $stat.Date.Month.String $ nil "dashboard" }} {{ $stat.Date.Year }}
                                        {{ else if eq $.period "daily" }}
                                            {{ $stat.Date.Day }} {{ i18n $stat.Date.Month.String $ nil "dashboard" }} {{ $stat.Date.Year }}
                                        {{ else }}
                                            <script type="application/javascript">document.write(dateToString('{{ $stat.Date.Format "2006-01-02T15:04:05-07:00" }}'))</script>
                                        {{ end }}
                                    </td>
                                    <td>
                                        <script type="application/javascript">document.write(valueFormat({{ $stat.Energy }}))</script>
                                        {{ if gt $stat.EnergyTrend 0.0 }}
                                            <span class="label label-danger">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyDelta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyTrend }}))</script>
                                            </span>
                                        {{ else if lt $stat.EnergyTrend 0.0 }}
                                            <span class="label label-success">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyDelta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyTrend }}))</script>
                                            </span>
                                        {{ else if eq $stat.EnergyTrend 0.0 }}
                                            <span class="label label-info">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyDelta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyTrend }}))</script>
                                            </span>
                                        {{ else if gt $stat.EnergyDelta 0.0 }}
                                            <span class="label label-default">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.EnergyDelta }}))</script>
                                            </span>
                                        {{ end }}
                                    </td>
                                    {{ if gt $.Bind.Config.InputsCount 0 }}
                                    <td>
                                        <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Volume }}))</script> / {{ $stat.Pulse1 }}
                                        {{ if gt $stat.Pulse1Trend 0.0 }}
                                            <span class="label label-danger">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Trend }}))</script>
                                            </span>
                                        {{ else if lt $stat.Pulse1Trend 0.0 }}
                                            <span class="label label-success">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Trend }}))</script>
                                            </span>
                                        {{ else if eq $stat.Pulse1Trend 0.0 }}
                                            <span class="label label-info">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Trend }}))</script>
                                            </span>
                                        {{ else if gt $stat.Pulse1Delta 0.0 }}
                                            <span class="label label-default">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse1Delta }}))</script>
                                            </span>
                                        {{ end }}
                                    </td>
                                    {{ end }}
                                    {{ if gt $.Bind.Config.InputsCount 1 }}
                                    <td>
                                        <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Volume }}))</script> / {{ $stat.Pulse2 }}
                                        {{ if gt $stat.Pulse2Trend 0.0 }}
                                            <span class="label label-danger">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Trend }}))</script>
                                            </span>
                                        {{ else if lt $stat.Pulse2Trend 0.0 }}
                                            <span class="label label-success">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Trend }}))</script>
                                            </span>
                                        {{ else if eq $stat.Pulse2Trend 0.0 }}
                                            <span class="label label-info">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Trend }}))</script>
                                            </span>
                                        {{ else if gt $stat.Pulse2Delta 0.0 }}
                                            <span class="label label-default">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse2Delta }}))</script>
                                            </span>
                                        {{ end }}
                                    </td>
                                    {{ end }}
                                    {{ if gt $.Bind.Config.InputsCount 2 }}
                                    <td>
                                        <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Volume }}))</script> / {{ $stat.Pulse3 }}
                                        {{ if gt $stat.Pulse3Trend 0.0 }}
                                            <span class="label label-danger">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Trend }}))</script>
                                            </span>
                                        {{ else if lt $stat.Pulse3Trend 0.0 }}
                                            <span class="label label-success">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Trend }}))</script>
                                            </span>
                                        {{ else if eq $stat.Pulse3Trend 0.0 }}
                                            <span class="label label-info">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Trend }}))</script>
                                            </span>
                                        {{ else if gt $stat.Pulse3Delta 0.0 }}
                                            <span class="label label-default">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse3Delta }}))</script>
                                            </span>
                                        {{ end }}
                                    </td>
                                    {{ end }}
                                    {{ if gt $.Bind.Config.InputsCount 3 }}
                                    <td>
                                        <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Volume }}))</script> / {{ $stat.Pulse4 }}
                                        {{ if gt $stat.Pulse4Trend 0.0 }}
                                            <span class="label label-danger">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Trend }}))</script>
                                            </span>
                                        {{ else if lt $stat.Pulse4Trend 0.0 }}
                                            <span class="label label-success">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Trend }}))</script>
                                            </span>
                                        {{ else if eq $stat.Pulse4Trend 0.0 }}
                                            <span class="label label-info">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Delta }}))</script> /
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Trend }}))</script>
                                            </span>
                                        {{ else if gt $stat.Pulse4Delta 0.0 }}
                                            <span class="label label-default">
                                                <script type="application/javascript">document.write(valueFormat({{ $stat.Pulse4Delta }}))</script>
                                            </span>
                                        {{ end }}
                                    </td>
                                    {{ end }}
                                </tr>
                                {{ end }}
                                </tbody>
                            </table>
                            {{ else }}
                            <table class="table table-striped datatable dt-responsive nowrap" style="width:100%">
                                <thead>
                                    <tr>
                                        <th>{{ i18n "Measurement" . }}</th>
                                        <th>{{ i18n "Value" . }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>{{ i18n "Date and time" . }}</td>
                                        {{ if .datetime.Error }}
                                            <td class="text-danger">{{ .datetime.Error.Error }}</td>
                                        {{ else }}
                                            <td>
                                                <script type="application/javascript">document.write(dateToString('{{ .datetime.Value.Format "2006-01-02T15:04:05-07:00" }}'))</script>
                                                {{ if ne .datetime.Delta 0 }}
                                                <strong class="text-danger">
                                                    {{ if gt .datetime.Delta 0 }}
                                                        {{ i18nPlural "+%d second" "+%d seconds" .datetime.Delta $ nil nil nil .datetime.Delta }}
                                                    {{ else }}
                                                        {{ i18nPlural "%d second" "%d seconds" .datetime.Delta $ nil nil nil .datetime.Delta }}
                                                    {{ end }}
                                                </strong>
                                                {{ end }}
                                            </td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Temperature in" . }}</td>
                                        {{ if .temperature_in.Error }}
                                            <td class="text-danger">{{ .temperature_in.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .temperature_in.Value }}))</script> {{ i18n "°C" }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Temperature out" . }}</td>
                                        {{ if .temperature_out.Error }}
                                            <td class="text-danger">{{ .temperature_out.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .temperature_out.Value }}))</script> {{ i18n "°C" }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Temperature delta" . }}</td>
                                        {{ if .temperature_delta.Error }}
                                            <td class="text-danger">{{ .temperature_delta.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .temperature_delta.Value }}))</script> {{ i18n "°C" }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Power" . }}</td>
                                        {{ if .power.Error }}
                                            <td class="text-danger">{{ .power.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .power.Value }}))</script> {{ i18n "Gcal/h" }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Energy" . }}</td>
                                        {{ if .energy.Error }}
                                            <td class="text-danger">{{ .energy.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .energy.Value }}))</script> {{ i18n "Gcal" }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Capacity" . }}</td>
                                        {{ if .capacity.Error }}
                                            <td class="text-danger">{{ .capacity.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .capacity.Value }}))</script> {{ raw (i18n "m<sup>3</sup>") }}</td>
                                        {{ end }}
                                    </tr>
                                    <tr>
                                        <td>{{ i18n "Consumption" . }}</td>
                                        {{ if .consumption.Error }}
                                            <td class="text-danger">{{ .consumption.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .consumption.Value }}))</script> {{ raw (i18n "m<sup>3</sup>/h") }}</td>
                                        {{ end }}
                                    </tr>
                                    {{ if gt .Bind.Config.InputsCount 0 }}
                                    <tr>
                                        <td>{{ i18n "Pulse input %d" . nil nil nil 1 }}</td>
                                        {{ if .pusle_input_1.Error }}
                                            <td class="text-danger">{{ .pusle_input_1.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .pusle_input_1.Value }}))</script> {{ i18n "pulses" }}</td>
                                        {{ end }}
                                    </tr>
                                    {{ end }}
                                    {{ if gt .Bind.Config.InputsCount 1 }}
                                    <tr>
                                        <td>{{ i18n "Pulse input %d" . nil nil nil 2 }}</td>
                                        {{ if .pusle_input_2.Error }}
                                            <td class="text-danger">{{ .pusle_input_2.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .pusle_input_2.Value }}))</script> {{ i18n "pulses" }}</td>
                                        {{ end }}
                                    </tr>
                                    {{ end }}
                                    {{ if gt .Bind.Config.InputsCount 2 }}
                                    <tr>
                                        <td>{{ i18n "Pulse input %d" . nil nil nil 3 }}</td>
                                        {{ if .pusle_input_3.Error }}
                                            <td class="text-danger">{{ .pusle_input_3.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .pusle_input_3.Value }}))</script> {{ i18n "pulses" }}</td>
                                        {{ end }}
                                    </tr>
                                    {{ end }}
                                    {{ if gt .Bind.Config.InputsCount 3 }}
                                    <tr>
                                        <td>{{ i18n "Pulse input %d" . nil nil nil 4 }}</td>
                                        {{ if .pusle_input_4.Error }}
                                            <td class="text-danger">{{ .pusle_input_4.Error.Error }}</td>
                                        {{ else }}
                                            <td><script type="application/javascript">document.write(valueFormat({{ .pusle_input_4.Value }}))</script> {{ i18n "pulses" }}</td>
                                        {{ end }}
                                    </tr>
                                    {{ end }}
                                    <tr>
                                        <td>{{ i18n "Operating time" . }}</td>
                                        {{ if .operating_time.Error }}
                                            <td class="text-danger">{{ .operating_time.Error.Error }}</td>
                                        {{ else }}
                                            <td>{{ .operating_time.Value.String }}</td>
                                        {{ end }}
                                    </tr>
                                </tbody>
                            </table>
                            {{ end }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{{ end }}

{{ define "head" }}
    {{ if eq .action "archive" }}
        {{ staticHTML (staticURL "/dashboard/assets/vendors/bootstrap-daterangepicker/css/daterangepicker.min.css" false) }}
    {{ end }}
{{ end }}

{{ define "js" }}
    {{ if eq .action "archive" }}
        {{ staticHTML (staticURL "/dashboard/assets/vendors/moment/js/moment.min.js" false) }}
        {{ staticHTML (staticURL "/dashboard/assets/vendors/bootstrap-daterangepicker/js/daterangepicker.min.js" false) }}

        <script type="application/javascript">
            $(document).ready(function () {
                $('#archive-date').daterangepicker({
                    timePickerIncrement: 60,
                    minDate: moment().subtract(5, 'year'),
                    maxDate: moment().endOf('day'),
                    applyButtonClasses: 'btn-success',
                    locale: {
                        format: 'YYYY.MM.DD HH:mm'
                    },
                    ranges: {
                        '{{ i18n "Today" . "daterangepicker" "boggart" }}': [moment().startOf('day'), moment()],
                        '{{ i18n "Yesterday" . "daterangepicker" "boggart" }}': [moment().subtract(1, 'days').startOf('day'), moment().subtract(1, 'days').endOf('day')],
                        '{{ i18n "This week" . "daterangepicker" "boggart" }}': [moment().startOf('isoWeek'), moment().endOf('isoWeek')],
                        '{{ i18n "Last week" . "daterangepicker" "boggart" }}': [moment().subtract(1, 'isoWeek').startOf('isoWeek'), moment().subtract(1, 'isoWeek').endOf('isoWeek')],
                        '{{ i18n "This month" . "daterangepicker" "boggart" }}': [moment().startOf('month'), moment().endOf('month')],
                        '{{ i18n "Last month" . "daterangepicker" "boggart" }}': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
                        '{{ i18n "This year" . "daterangepicker" "boggart" }}': [moment().startOf('year'), moment().endOf('year')],
                        '{{ i18n "Last year" . "daterangepicker" "boggart" }}': [moment().subtract(1, 'year').startOf('year'), moment().subtract(1, 'year').endOf('year')]
                    },
                });

                $('#archive-form').submit(function (e) {
                    var dp = $('#archive-date').data('daterangepicker');

                    $('#archive-form input[name="from"]').val(moment(dp.startDate).format('YYYY-MM-DD[T]HH:mm:ssZ'));
                    $('#archive-form input[name="to"]').val(moment(dp.endDate).format('YYYY-MM-DD[T]HH:mm:ssZ'));
                });
            });
        </script>
    {{ end }}
{{ end }}